/**
 * Created by U on 2016/11/16.
 */

window.onload = function () {
    //手风琴
    var we_bigBox = document.getElementById("we_bigBox");
    var we_boxes = we_bigBox.children;
    var we_music = document.getElementById("we_music");

    for (var i = 0; i < we_boxes.length; i++) {
        we_boxes[i].style.left = 220 * i - 45 + "px";
    }
    setTimeout(function(){
        we_music.play();
        weShow();
    },1000);


};
//前面动画
function weShow(){
    //前言
    var we_preface = document.getElementById("we_preface");
    var we_prefaces = we_preface.children;
    we_timing(we_prefaces[0], 3800);
    we_timing(we_prefaces[1], 7200);
    we_timing(we_prefaces[2], 10500);
    we_timing(we_prefaces[3], 11300);
    we_timing(we_prefaces[4], 12100);
    we_timing(we_prefaces[5], 12900);
    we_timing(we_prefaces[6], 13900);

    function we_timing(obj, time) {
        setTimeout(function () {
            obj.style.opacity = 1;
        }, time);
    }

    setTimeout(function () {
        animate(we_preface, {"opacity": 0}, function () {
            we_preface.style.display = "none";
            we_huluDown();
        });
    }, 17000);

    //葫芦
    var we_hulu = document.getElementById("we_hulu");
    //var hostaryX = 0;
    //we_huluDown();

    function we_huluDown() {

        var speedX = screen.width/1366*6;
        var speedY = 0;
        timer = setInterval(function () {
            speedY += 1;
            we_hulu.style.left = we_hulu.offsetLeft + speedX + "px";
            we_hulu.style.top = we_hulu.offsetTop + speedY + "px";
            we_huluTurn(we_hulu, 720);
            if (we_hulu.offsetTop + we_hulu.offsetHeight > 600) {
                we_hulu.style.top = 600 - we_hulu.offsetHeight + "px";
                speedY = -speedY * 0.6;
                speedX = speedX * 0.9;
            }
            if (we_hulu.style.transform === "rotate(720deg)") {
                clearInterval(timer);
                we_hulu.style.background = "url(images/we_bg1.jpg)";
                animate(we_hulu, {
                    "width": 1200,
                    "height": 600,
                    "top": 0,
                    "left": (screen.width-1200)/2,
                });
            }
        }, 25);
    }

//转葫芦函数
    function we_huluTurn(obj, num) {
        var leader = parseInt(obj.style.transform.slice(7, -1)) || 0;
        var target = num;
        //var step = Math.ceil((target - leader) / 10);
        leader += 6;
        obj.style.transform = "rotate(" + leader + "deg)";
    }

    //介绍介绍介绍介绍介绍介绍介绍介绍
    var we_pages = document.getElementsByClassName("we_page");
    //第一页 23000
    setTimeout(function () {
        animate(we_hulu, {
            "opacity": 0
        }, function () {
            we_hulu.style.display = "none";
        });
        animate(we_pages[0], {"opacity": 1});
    }, 23000);

    //第二页30000

    setTimeout(function () {
        animate(we_pages[0], {
            //"width": 1200,
            //"height": 600,
            //"top": 0,
            //"left": 83,
            "opacity": 0
        });
        animate(we_pages[1], {"opacity": 1});
    }, 30000);

    //王琪37000

    setTimeout(function () {
        animate(we_pages[1], {
            "opacity": 0
        });
        animate(we_pages[2], {"opacity": 1}, function () {
            we_wqdown(we_pages[2].children[0]);
        });
    }, 37000);
    function we_wqdown(ele) {
        var speedY = 0;
        var g = 1;
        ele.timer = setInterval(function () {
            speedY += g;
            g++;
            ele.style.top = ele.offsetTop + speedY + "px";
            if (ele.offsetTop + ele.offsetHeight > 600) {
                ele.style.top = 600 - ele.offsetHeight + "px";
                clearInterval(ele.timer);
                we_DD(we_pages[2]);
            }
        }, 15);
    }

    function we_DD(ele) {
        var num = 140;
        ele.timer = setInterval(function () {
            num -= 2;
            var x = Math.floor(Math.random() * num / 4) + window.innerWidth/2;
            var y = Math.floor(Math.random() * num / 4);
            ele.style.left = x + "px";
            ele.style.top = y + "px";
        }, 15);
        setTimeout(function () {
            clearInterval(ele.timer);
            ele.style.left = window.innerWidth/2+"px";
            ele.style.top = "0px";
        }, 1000);

    };


    //马超44000

    setTimeout(function () {
        animate(we_pages[2], {
            "opacity": 0
        });
        animate(we_pages[3], {"opacity": 1}, function () {
            we_mcyan(we_pages[3].children[1]);
            we_mcyan(we_pages[3].children[2]);
        });
    }, 44000);
    function we_mcyan(ele) {
        var num = 0;
        var g = 1;
        var a = 0;
        ele.timer = setInterval(function () {
            a++;
            num += g;
            ele.style.opacity = num / 10;
            if (num === 10) {
                g = -g;
            }
            if (num === 0) {
                g = -g;
            }
            if (a >= 280) {
                clearInterval(ele.timer);
            }
        }, 25);
    }


    //秦凯51000
    setTimeout(function () {
        animate(we_pages[3], {
            "opacity": 0
        });
        animate(we_pages[4], {"opacity": 1}, function () {
            setTimeout(we_xin(we_pages[4].children[2]), 2000);
        });
    }, 51000);
    function we_xin(ele) {
        var xinS = 4;
        var xinO = 8;
        ele.timer = setInterval(function () {
            xinS++;
            ele.style.fontSize = xinS + "px";
            ele.style.left = 178 + xinS + "px";
            if (xinS < 15) {
                ele.style.opacity = xinS - 4 / 10;
            }
            if (xinS >= 250) {
                xinO = xinO - 1;
                ele.style.opacity = xinO / 10;
            }
            if (xinO === 0) {
                clearInterval(ele.timer);
                ele.style.left = "170px";
                ele.style.top = "178px";
            }
        }, 15);
    }

    //李金金58000
    setTimeout(function () {
        animate(we_pages[4], {
            "opacity": 0
        });
        animate(we_pages[5], {"opacity": 1}, function () {
            we_jjdown(we_pages[5].children[0]);
        });
    }, 58000);
    function we_jjdown(ele) {
        var speedY = 0;
        var num = 0;
        ele.timer = setInterval(function () {
            speedY += 1;
            num++;
            ele.style.top = ele.offsetTop + speedY + "px";
            if (ele.offsetTop + ele.offsetHeight > 600) {
                ele.style.top = 600 - ele.offsetHeight + "px";
                speedY = -speedY * 0.6;
            }
            if (num >= 200) {
                clearInterval(ele.timer);
            }
        }, 25);
    }

    //徐江龙65000
    setTimeout(function () {
        animate(we_pages[5], {
            "opacity": 0
        });
        animate(we_pages[6], {"opacity": 1}, function () {
            xjlshui(we_pages[6].children[1]);
        });

    }, 65000);
    function xjlshui(ele) {
        var h = 0;
        ele.timer = setInterval(function () {
            h += 2;
            ele.style.height = h + "px";
            if (h >= 326) {
                clearInterval(ele.timer);
            }
        }, 15);
    }

    //6娃72000
    setTimeout(function () {
        animate(we_pages[6], {
            "opacity": 0
        });
        animate(we_pages[7], {"opacity": 1},
            function () {
                we_sixText(we_pages[7].children[2]);
            });
    }, 72000);
    function we_sixText(ele) {
        var spans = ele.children;
        var num = 0;
        ele.timer = setInterval(function () {
            animate(spans[num], {
                "opacity": 1
            });
            num++;
            if (num === spans.length) {
                clearInterval(ele.timer);
            }
        }, 600);
    }

    //朱天宇79000
    setTimeout(function () {
        animate(we_pages[7], {
            "opacity": 0
        });
        animate(we_pages[8], {"opacity": 1});
    }, 79000);
    //老师86000
    setTimeout(function () {
        animate(we_pages[8].children[1], {
            "left": 525,
            "top": 97,
            "width": 0,
            "height": 0,
            "transform": 1080
        }, function () {
            animate(we_pages[8], {"opacity": 0});
            animate(we_pages[9], {"opacity": 1});
        });

    }, 83000);
    //手风琴95000
    setTimeout(function () {
        animate(we_pages[9], {
            //"width": 1200,
            //"height": 600,
            //"top": 0,
            //"left": 83,
            "opacity": 0
        });
        animate(we_bigBox, {"opacity": 1}, function () {
            //最后导航
            weNav();
        });
    }, 95000);
}
//最后我们导航
function weNav() {
    var we_bigBox = document.getElementById("we_bigBox");
    var we_boxes = we_bigBox.children;
    var we_navTxts = document.getElementsByClassName("we_navTxt");
    var we_histaryNum = 0;
    var we_smallBoxs = document.getElementsByClassName("we_smallBox");
    var we_boxBgs = document.getElementsByClassName("we_boxBg");
    var we_startSmallLeft = we_smallBoxs[0].offsetLeft;
    //we_boxes[6].style.backgroundColor = "white";

    function we_boxesEvent() {
        for (var i = 0; i < we_boxes.length-1; i++) {
            we_boxes[i].index = i;
            we_boxes[i].onmouseover = function () {
                for (var j = 0; j < we_boxes.length-1; j++) {

                    if (j <= this.index) {
                        animate(we_boxes[j], {"left": 110 * j - 45});
                    } else {
                        animate(we_boxes[j], {"left": 110 * j + 615});
                    }
                    if (j === this.index) {
                        animate(we_smallBoxs[j], {"top": 300});
                        animate(we_smallBoxs[j].children[0], {"left": 300});
                        animate(we_smallBoxs[j].children[1].children[1], {"opacity": 1});
                    } else {
                        animate(we_smallBoxs[j], {"top": 450});
                        animate(we_smallBoxs[j].children[0], {"left": 28});
                        animate(we_smallBoxs[j].children[1].children[1], {"opacity": 0});
                    }
                }
            };
            //we_boxes[6].onmouseover = null;
        }
        we_bigBox.onmouseleave = function () {
            for (var i = 0; i < we_boxes.length-1; i++) {
                animate(we_boxes[i], {"left": 220 * i - 45});
                animate(we_smallBoxs[i], {"top": 450});
                animate(we_smallBoxs[i].children[0], {"left": 28});
                animate(we_smallBoxs[i].children[1].children[1], {"opacity": 0});
            }
        };
    }

    we_boxBgsStart(0);
    function we_boxBgsStart(num) {
        if (num === 6) {
            we_boxesEvent();
            return;
        }
        animate(we_boxBgs[num], {"left": 0}, function () {
            num++;
            we_boxBgsStart(num);
        });
    }
};